<template>
	<div class="logdetail">
		<div class='head'>
            <p class='title-icon'>
            	<a class='iconfont icon-jiantouzuo' href="javascript:history.go(-1)"></a>
            </p>
            <p class='title-text'>订单详情</p>
            <p class="title-null"></p>
      	</div>   
      <div class="selivery-icon">
      	<div class="picked-up">
      		<div class="pick-up-bg">
      			<p class="pick-up-icon iconfont icon-dingdan"></p>
      		</div>
      		<p class="pick-up-p gray">待取货</p>
      	</div>
      	<div class="line">
      		<p class="line-p"></p>
      	</div>
      	<div class="distribution">
      		<div class="distr-up-bg">
      			<p class="distr-up-icon iconfont icon-tubiao5"></p>
      		</div>
      		<p class="distr-up-p gray">配送中</p>
      	</div>
      	<div class="line">
      		<p class="line-p"></p>
      	</div>
      	<div class="completed">
      		<div class="comp-up-bg">
      			<p class="comp-up-icon iconfont icon-wancheng"></p>
      		</div>
      		<p class="comp-up-p gray">已完成</p>
      	</div>
      </div>
      <div class="busines-info">
		<p class="bus-title">商家信息</p>
		<div class="bus-content">
			<p>
				<span class="bus-left">姓名</span>
				<span class="bus-name">清粥小菜</span>
			</p>
			<p>
				<span class="bus-left">手机</span>
				<span class="bus-phone">15698745845</span>
			</p>
			<p>
				<span class="bus-left">地址</span>
				<span class="bus-addr">遂宁市香林南路19号</span>
			</p>
		</div>
	</div>
	<div class="busines-info">
		<p class="bus-title">收货人信息</p>
		<div class="bus-content">
			<p>
				<span class="bus-left">姓名</span>
				<span class="bus-name">李明</span>
			</p>
			<p>
				<span class="bus-left">手机</span>
				<span class="bus-phone">15698745845</span>
			</p>
			<p>
				<span class="bus-left">地址</span>
				<span class="bus-addr">遂宁市香林南路19号</span>
			</p>
		</div>
	</div>
	<div class="busines-info">
		<p class="bus-title">物品信息</p>
		<div class="bus-content">
			<p>
				<span class="bus-left">订单号码</span>
				<span>2368474584152</span>
			</p>
			<p>
				<span class="bus-left">配送距离</span>
				<span>1.5千米</span>
			</p>
			<p>
				<span class="bus-left">配送费用</span>
				<span>8.00元</span>
			</p>
			<p>
				<span class="bus-left">取货时间</span>
				<span>今天11:00</span>
			</p>
			<p class="pro-list">
				<span class="bus-left">商品信息</span>
				<ul>
					<li>农家小炒菜<span class="pro-num">x1</span></li>
					<li>莲白回锅<span class="pro-num">x1</span></li>
					<li>蒜泥白肉<span class="pro-num">x1</span></li>
				</ul>
				
			</p>
			<p>
				<span class="bus-left">商家捎话</span>
				<span>请马上来取货很紧急</span>
			</p>
		</div>
	</div>
	<div class="button">
	 	<p class="info-submit">
        	<router-link to='/home'>确认取货</router-link>
        </p>
	 </div>
	</div>
</template>

<script>
</script>

<style scoped>
	p{
		margin: 0px;
	}
	.selivery-icon{
		display: flex;
		background-color: white;
		margin: 5px 0px 5px 0px;
		padding: 10px 15px 15px 15px;
	}
	.pick-up-icon,.comp-up-icon,.distr-up-icon{
		font-size: 2rem;
	}
	.selivery-icon > div{
		flex: 1;
		text-align: center;
		height: 70px;
	}
	.line{
		height: 70px;
		line-height: 70px;
	}
	.line-p{
		border: 1px #cccccc solid;
		display: inline-block;
    	width: 100%;
	}
	.pick-up-bg,.distr-up-bg,.comp-up-bg{
		margin: 0 auto;
		height: 50px;
		width: 50px;
		text-align: center;
		line-height: 50px;
		background: #CCCCCC;
		border-radius: 50%;
		color: white;
	}
	.busines-info{
		margin-bottom: 5px;
	}
	.iconfont{
		margin: 0px;
	}
	.gray{
		color: #CCCCCC;
		margin: 5px 0px 5px 0px;
	}
	
	.busines-info{
		background-color:white;
		line-height: 35px;
	}
	.bus-title{
		padding:5px 10px 5px 10px;
		border-bottom: 1px #ebebeb solid;
	}
	.bus-title,.bus-left{
		color: #CCCCCC;
	}
	.bus-content{
		padding: 10px;
	}
	.bus-left{
		display: inline-block;
		margin-right: 10px;
	}
	ul{
		display: inline-block;
		list-style: none;
		padding-left: 5px;
		margin: 0px;
	}
	ul>li{
	
	}
	.pro-num{
		color: #cccccc;
		margin-left: 10px;
	}
	.pro-list{
		display: flex;
	}
	.button{
		padding: 10px;
		background-color: white;
	}
	.bus-phone{
		text-decoration: underline;
		color: #71B4EB;
	}
</style>